<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>

		<link rel="stylesheet" type="text/css" href="boot/dist/css/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css" />
		<link rel="stylesheet" type="text/css" href="css/shop.css" />

		<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="boot/dist/js/bootstrap.bundle.min.js"></script>
		<script src="js/popper.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="boot/dist/js/bootstrap.js"></script>

	</head>
	<body>

		<!-- 头部区域 -->
		<herder>
			<!-- 头部导航栏区域 -->
			<div class="container  py-3 d-flex  justify-content-between flex-md-row flex-column">
				<ul class="list-unstyled d-flex mx-md-0 mx-auto">
					<li>
						<a href="#" class="fa fa-user nav_color">
							<i class="text-muted">Login</i>
						</a>
					</li>
					<li class="mx-3">
						<a href="#" class="fa fa-pencil nav_color">
							<i class="text-muted">Register</i>
						</a>
					</li>
					<li>
						<a href="#" class="fa fa-cart-plus nav_color">
							<i class="text-muted">Checkout</i>
						</a>
					</li>
				</ul>

				<ol class="list-unstyled d-flex mx-md-0 mx-auto ">
					<li class="mx-3">
						<a href="#" class="fa fa-heart nav_color">
							<i class="text-muted">Wishlist</i>
						</a>
					</li>

					<li>
						<a href="#" class="fa fa-angle-down nav_color ">
							<i class="text-muted">USD</i>
						</a>
					</li>
				</ol>

			</div>


			<!-- 头部导航栏搜索框区域 -->
			<div class="" style="background-image: url(images/header_bg.jpg);">
			
				<div class=" " style="background-color: rgba(0,0,0,0.8);">
			
					<div class="container py-4">
			
						<ul class="d-flex justify-content-between align-items-center flex-md-row flex-column mb-0 pl-0">
			
							<li class="">
								<a href="#"><img src="images/logo.png" class="w-100"></a>
							</li>
			
							<li class="form_qu">
								<form class="form-control d-flex justify-content-between " style=" height: 50px; padding-top: 4px; padding-right: 2px;" >
									<input type="text" placeholder="Search" class="border-0" style="outline: none;">
									<button type="" class="border-0 text-muted btn" style="background-color: #E4606D; width: 55px; height: 40px; "><i class="fa fa-search text-white"></i></button>
			
								</form>
							</li>
						</ul>
			
					</div>
			
			
				</div>
			
			</div>

			<!-- 头部导航栏分栏 -->
			<div class="w-100 nav_tou " style="background-color: #E4606D;">

				<div class="navbar navbar-expand-md p-0">
					<button type="button " class="navbar-toggler bg-white ml-auto" data-toggle="collapse" data-target="#meu" style="color: white;">
						<i class="fa fa-bars " style="background-color: #E4606D;"></i>
					</button>


					<div class="collapse navbar-collapse " id="meu">
						<ul class=" list-unstyled d-flex text-center mx-auto justify-content-around justify-content-center navbar-nav "
						 style="">
							<li class="nav-item">
								<a href="index.html" class="nav-link ">Home</a>
							</li>
							<li class="nav-item ">
								<a href="about.html" class="nav-link ">About</a>
							</li>
							<li class="nav-item  ">
								<a href="services.html" class="nav-link ">Services</a>
							</li>
							<li class="nav-item  ">
								<a href="gallery.html" class="nav-link">Gallery</a>
							</li>
							<li class="nav-item  ">
								<a href="blog.html" class="nav-link">Blog</a>
							</li>
							<li class="nav-item  ">
								<a href="#" class="nav-link defoult">Shop</a>
							</li>
							<li class="nav-item  ">
								<a href="contact.html" class="nav-link">Contact</a>
							</li>
							
						</ul>
					</div>

				</div>
			</div>


			<!-- -->

		</herder>


		<!-- 中部区域 -->
		<main>

			<div class="row m-0 ">
				<div class="col-12 pl-0 pr-0 py-5" style="background-image: url(images/choose_bg.jpg);">
					<div class=" py-5 w-100 " style="background-color: rgba(0,0,0,0.3); background: repeat; ">
						<div class=" text-center">
							<h2 class="m-0" style="color: #E4606D;">Shop</h2>
							<hr class="" style="width: 105px; background-color: #E4606D; margin-top: 1px;">
							<hr class="" style="width: 65px; background-color: #E4606D; margin-top: -12px">
							<p style="color: #E4606D;">Home<i class="text-dark"> / Shop</i></p>
						</div>
					</div>
				</div>
			</div>


			<!-- 中部商品部分 -->
			<div class="" style="background-image: url(images/patterns/pattern-3.jpg);">
				
				<div class="" style="background-color: rgba(0,0,0,0.8);">
				
					<p class="font-weight-bold py-5" style="font-size: 30px; margin: 0 auto;  color:  #E4606D; width: 300px;">Our<span
						 class="" style="font-size: 30px; color: white;">New Arrivals</span></p>
				
					<div class="container ">
						<ul class="row m-0 pl-0">
				
							<!-- 一 -->
							<li class="col-lg-4 col-md-6 col-12 py-3 nav_li">
				
								<img src="./images/new_pro1.jpg" class="w-100 ">
				
								<div class="bg-white py-3 " style="padding-left: 20px; padding-right: 20px;">
									<i class="font-weight-bold " style="font-size: 24px;">Jellied Eels.</i>
				
									<p style="font-size: 16px; " class="text-muted">orem Ipsum has been the industry's standard dummy text ever
										since the
										1500s</p>
				
									<div class="d-flex">
										<span class="font-weight-bold" style="font-size: 18px; color:  #E4606D;">$12 Only</span>
				
				
										<a href="#" class="btn_n text-center ml-auto ">
											<i class="fa fa-cart-plus btn_gou"></i>
										</a>
				
									</div>
								</div>
				
							</li>
				
				
							<!-- 二 -->
							<li class="col-lg-4 col-md-6 col-12 py-3 nav_li">
				
				
				
								<div class="bg-white py-3 " style="padding-left: 20px; padding-right: 20px;">
									<i class="font-weight-bold " style="font-size: 24px;">Deep Fried Pomfret.</i>
				
									<p style="font-size: 16px; " class="text-muted">orem Ipsum has been the industry's standard dummy text ever
										since the
										1500s</p>
				
									<div class="d-flex">
										<span class="font-weight-bold" style="font-size: 18px; color:  #E4606D;">$12 Only</span>
				
				
										<a href="#" class="btn_n text-center ml-auto ">
											<i class="fa fa-cart-plus btn_gou"></i>
										</a>
				
									</div>
								</div>
				
								<img src="./images/new_pro2.jpg" class="w-100">
				
							</li>
				
							<!-- 三 -->
							<li class="col-lg-4 col-md-6 col-12 py-3 nav_li">
				
								<img src="./images/new_pro3.jpg" class="w-100">
				
								<div class="bg-white py-3 " style="padding-left: 20px; padding-right: 20px;">
									<i class="font-weight-bold " style="font-size: 24px;">Marinated Swordfish</i>
				
									<p style="font-size: 16px; " class="text-muted">orem Ipsum has been the industry's standard dummy text ever
										since the
										1500s</p>
				
									<div class="d-flex">
										<span class="font-weight-bold" style="font-size: 18px; color:  #E4606D;">$12 Only</span>
				
				
										<a href="#" class="btn_n text-center ml-auto ">
											<i class="fa fa-cart-plus btn_gou"></i>
										</a>
				
									</div>
								</div>
				
							</li>
				
							<!-- 四 -->
							<li class="col-lg-4 col-md-6 col-12 py-3 nav_li">
				
								<img src="./images/new_pro4.jpg" class="w-100">
				
								<div class="bg-white py-3 " style="padding-left: 20px; padding-right: 20px;">
									<i class="font-weight-bold " style="font-size: 24px;">Jellied</i>
				
									<p style="font-size: 16px; " class="text-muted">orem Ipsum has been the industry's standard dummy text ever
										since the
										1500s</p>
				
									<div class="d-flex">
										<span class="font-weight-bold" style="font-size: 18px; color:  #E4606D;">$12 Only</span>
				
				
										<a href="#" class="btn_n text-center ml-auto ">
											<i class="fa fa-cart-plus btn_gou"></i>
										</a>
				
									</div>
								</div>
				
							</li>
				
							<!-- 五 -->
							<li class="col-lg-4 col-md-6 col-12 py-3 nav_li">
				
				
				
								<div class="bg-white py-3 " style="padding-left: 20px; padding-right: 20px;">
									<i class="font-weight-bold " style="font-size: 24px;">Salmon</i>
				
									<p style="font-size: 16px; " class="text-muted">orem Ipsum has been the industry's standard dummy text ever
										since the
										1500s</p>
				
									<div class="d-flex">
										<span class="font-weight-bold" style="font-size: 18px; color:  #E4606D;">$12 Only</span>
				
				
										<a href="#" class="btn_n text-center ml-auto ">
											<i class="fa fa-cart-plus btn_gou"></i>
										</a>
				
									</div>
								</div>
				
								<img src="./images/new_pro5.jpg" class="w-100">
				
							</li>
				
				
							<!-- 六 -->
							<li class="col-lg-4 col-md-6 col-12 py-3 nav_li">
				
								<img src="./images/new_pro6.jpg" class="w-100">
				
								<div class="bg-white py-3 " style="padding-left: 20px; padding-right: 20px;">
									<i class="font-weight-bold " style="font-size: 24px;">Salmon Roe.</i>
				
									<p style="font-size: 16px; " class="text-muted">orem Ipsum has been the industry's standard dummy text ever
										since the
										1500s</p>
				
									<div class="d-flex">
										<span class="font-weight-bold" style="font-size: 18px; color:  #E4606D;">$12 Only</span>
				
				
										<a href="#" class="btn_n text-center ml-auto ">
											<i class="fa fa-cart-plus btn_gou"></i>
										</a>
				
									</div>
								</div>
				
							</li>
						</ul>
					</div>
				
				</div>
				
			</div>


			<!-- 中部6个小老虎图标区域 -->
			<div class="py-5" style="background-color: gainsboro">

				<p class="font-weight-bold py-3 d-flex justify-content-center" style="font-size: 30px; margin: 0 auto;  color:  #E4606D;">Our<span
					 class="" style="font-size: 30px; color: black;">Featured Products</span></p>

				<div class="container p-0">
					<ul class="row m-0 pl-0">
						<li class="col-lg-4 col-md-6 col-12 py-3 ">

							<img src="images/pro1.jpg" class="w-100" />

							<div class="bg-white py-3 " style="background-color: #E4606D !important;">
								<i class="font-weight-bold d-block text-center" style="font-size: 22px; color: white;">Showcase Elephant</i>

								<div class="text-center">
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
								</div>


								<p style="font-size: 16px; color: white;" class="text-center">Iorem Ipsum has been the industry's standard
									dummy text ever since the 1500s</p>


							</div>

						</li>



						<li class="col-lg-4 col-md-6 col-12 py-3 ">

							<img src="images/pro2.jpg" class="w-100" />

							<div class="bg-white py-3 " style="background-color: #E4606D !important;">
								<i class="font-weight-bold d-block text-center" style="font-size: 22px; color: white;">Showcase</i>

								<div class="text-center">
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
								</div>


								<p style="font-size: 16px; color: white;" class="text-center">Iorem Ipsum has been the industry's standard
									dummy text ever since the 1500s</p>


							</div>

						</li>


						<li class="col-lg-4 col-md-6 col-12 py-3 ">

							<img src="images/pro3.jpg" class="w-100" />

							<div class="bg-white py-3 " style="background-color: #E4606D !important;">
								<i class="font-weight-bold d-block text-center" style="font-size: 22px; color: white;">Ladies Purse</i>

								<div class="text-center">
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
								</div>


								<p style="font-size: 16px; color: white;" class="text-center">Iorem Ipsum has been the industry's standard
									dummy text ever since the 1500s</p>


							</div>

						</li>


						<li class="col-lg-4 col-md-6 col-12 py-3 ">

							<img src="images/pro4.jpg" class="w-100" />

							<div class="bg-white py-3 " style="background-color: #E4606D !important;">
								<i class="font-weight-bold d-block text-center" style="font-size: 22px; color: white;">Wooden Showcase</i>

								<div class="text-center">
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
								</div>


								<p style="font-size: 16px; color: white;" class="text-center">Iorem Ipsum has been the industry's standard
									dummy text ever since the 1500s</p>


							</div>

						</li>

						<li class="col-lg-4 col-md-6 col-12 py-3 ">

							<img src="images/pro5.jpg" class="w-100" />

							<div class="bg-white py-3 " style="background-color: #E4606D !important;">
								<i class="font-weight-bold d-block text-center" style="font-size: 22px; color: white;">Paper Dolls</i>

								<div class="text-center">
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
								</div>


								<p style="font-size: 16px; color: white;" class="text-center">Iorem Ipsum has been the industry's standard
									dummy text ever since the 1500s</p>


							</div>

						</li>

						<li class="col-lg-4 col-md-6 col-12 py-3 ">

							<img src="images/pro6.jpg" class="w-100" />

							<div class="bg-white py-3 " style="background-color: #E4606D !important;">
								<i class="font-weight-bold d-block text-center" style="font-size: 22px; color: white;">Chair</i>

								<div class="text-center">
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
									<i class="fa fa-star text-warning "></i>
								</div>


								<p style="font-size: 16px; color: white;" class="text-center">Iorem Ipsum has been the industry's standard
									dummy text ever since the 1500s</p>


							</div>

						</li>
					</ul>
				</div>

			</div>
		</main>


		<!-- 底部区域 -->
		<footer>

			<!-- 底部黑色区域部分 -->
			<div class="" style=" background-color: black;">

				<div class="container">

					<ul class="row m-0 pl-0">
						<li class="col-lg-4 col-md-6 col-12   py-5" style="background-color: black;">

							<img src="images/logo.png" class="">

							<p class="text-white  mt-4" style="font-size: 18px;">It is a long established fact that a reader will be
								distracted by the readable content of a page when looking at its layout.</p>



						</li>
						<li class="col-lg-2 col-md-6 col-12 " style="background-color: black;">
							<p class=" font-weight-bold mt-5" style="font-size: 19px; margin: 0px; color:  #E4606D;">Help</p>


							<div class="text-white mt-3 footer_text">
								<a href="#">
									<p>Your Beer</p>
								</a>
								<a href="#">
									<p>Customer Service</p>
								</a>
								<a href="#">
									<p>Contact</p>
								</a>
								<a href="#">
									<p>Recent Orders</p>
								</a>

							</div>


						</li>
						<li class="col-lg-2 col-md-6 col-12  py-5" style="background-color: black; margin: 0px;">
							<p class=" font-weight-bold " style="font-size: 19px; margin: 0px; color:  #E4606D;">Links</p>

							<div class="text-white mt-3 footer_text">
								<a href="#">
									<p>Home</p>
								</a>
								<a href="#">
									<p>Shop</p>
								</a>
								<a href="#">
									<p>404 Page</p>
								</a>
								<a href="#">
									<p>Login</p>
								</a>
							</div>

						</li>
						<li class="col-lg-4 col-md-6 col-12 py-5 " style="background-color: black;">

							<p class=" font-weight-bold " style="font-size: 19px; margin: 0px; color:  #E4606D;">Our Information</p>

							<div class="">
								<i class="fa fa-map-marker  mt-3" style="color:  #E4606D;"></i>
								<p class="d-inline-block ml-2" style="font-size: 16px; margin: 0px; color: white;">787 Lakeview St. Marion, NC
								</p>
								<p class="text-white">&nbsp;&nbsp;&nbsp; 28752 </p>
								<p></p>

							</div>

							<div class="">
								<i class="fa fa-phone t mt-3" style="color:  #E4606D;"></i>
								<p class="d-inline-block ml-2" style="font-size: 16px; margin: 0px; color: white;">+1800123654789 </p>
								<p class="text-white">&nbsp;&nbsp;&nbsp; +1800123456788 </p>
								<p></p>

							</div>

							<div class="">
								<i class="fa fa-envelope mt-3" style="color:  #E4606D;"></i>
								<p class="d-inline-block ml-2" style="font-size: 16px; margin: 0px; color: white;">Support@Handmade.Net</p>
								<p></p>

							</div>
						</li>
					</ul>

				</div>

			</div>



			<!-- 底部联系我们部分区域 -->
			<ul class="row m-0 p-0">
				<li class="col-md-6 col-12 py-3 text-center " style="background-color:#E4606D ;">
					<p class="text-white mt-2">Copyrights © 2018 All Rights <a href="#" style="color: blue;" class="a_se">Reserved</a> by Himanshusofttech</p>
				</li>

				<li class="col-md-6 col-12 text-center py-3 " style="background-color:#E4606D ;">
					<i class="fa fa-facebook text-white d-block mt-3">
						<i class="fa fa-twitter ml-3"></i>
						<i class="fa fa-google-plus ml-3"></i>
						<i class="fa fa-pinterest-p ml-3"></i>
						<i class="fa fa-linkedin ml-3"></i>
					</i>
				</li>
			</ul>
		</footer>

	</body>
</html>
